import React, { useEffect, useImperativeHandle, useState, useRef } from 'react';

const Child = React.forwardRef(function Child(props, ref) {
  let [text, setText] = useState('你好世界');
  const submit = () => {};

  useImperativeHandle(ref, () => {
    //在这里返回的内容，都可以被父组件的Ref对象获取到
    return {
      text,
      submit,
    };
  });
  return (
    <>
      <div className='child-box'>
        <span>哈哈哈</span>
      </div>
    </>
  );
});

export default function CaseOne() {
  let x = useRef(null);
  useEffect(() => {
    console.log(x.current);
  }, []);
  return (
    <>
      <div className='demo'>
        <Child ref={x} />
      </div>
    </>
  );
}
